<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>axios</title>
</head>
<body>
    
</body>
<script src="./js/axios.js"></script>
<script>
    // url是后台接口地址
    // data是axios固定的写法,res可以随意命名
    axios.get(url).then(res=>console.log(res.data))
    // 第一种 后台通过query获取
    axios.get('/books?id=12')
    .then(res=>console.log(res.data))
    // 第二种 后台通过params获取
    axios.get('/books/12')
    .then(res=>console.log(res.data))
    // 第三种 用的最多的一种方法 后台通过query获取
    axios.get('/books',{
        params:{
            id:12
        }
    })
    .then(res=>console.log(res.data))
    // POST传参
    axios.post('/books',{
        params:{
            id:12,
            name:'carlos'
        }
    }).then(ret=>console.log(ret))
    axios.put('/books/123',{
        params:{
            id:12,
            name:'carlos'
        }
    }).then(ret=>console.log(ret))
    // 固定的API
    var params=new URLSearchParams()
    params.append('uname','carlos')
    params.append('pwd','123')
    axios.post(url,params).then(ret=>console.log(ret))
    // 后台接口
    app.get('/data',(req,res)=>{
        res.send(req.query.id)
    })
    app.get('/data',(req,res)=>{
        res.send(req.params.id)
    })
    app.get('/data',(req,res)=>{
        res.send(req.query.id)
    })
    app.put('/data/:id',(req,res)=>{
        res.send(req.params.id+''+req.body.uname)
    })
    app.all('*',(req,res,next)=>{
        res.header('Access-Control-Allow-Origin','*')
        res.header('Access-Control-Allow-Methods','PUT,GET,POST,DELETE,OPTIONS')
        res.header('Access-Control-Allow-Headers','X-Requested-With')
        res.header('Access-Control-Allow-Headers','Content-Type')
        res.header('Access-Control-Allow-Headers','mytoken')
        next()
    })

</script>
</html>